<template>
  <a-upload
    v-model:file-list="fileList"
    :maxCount="1"
    :showUploadList="false"
    :headers="{authorization: 'authorization-text'}"
    :customRequest="beforeUpload"
    :loading="uploadLoading"
  >
    <!-- @change="handleChange" -->
    <!-- action="/api/errorLianlu/errorLianluFile" -->
    <a-button>
      <UploadOutlined />导入
    </a-button>
  </a-upload>
</template>
<script lang="ts">
import { Buffer } from 'buffer';
import { UploadOutlined } from '@ant-design/icons-vue';
import { message } from 'ant-design-vue';
import type { UploadChangeParam } from 'ant-design-vue';
import { defineComponent, Ref, ref } from 'vue';
import { insetErrorLianluByFileApi } from '@/utils/errorLianlu'
interface ErrorLianluDto {
  lianlu_code: string;
  lianlu_name: string;
  lianlu_start: string;
  lianlu_end: string;
  error_time_start: string;
  error_time_end: string;
  error_reason: string;
  plan_error: string;
  record_date: string;
}
interface ResultDto {
  code: number
  data: Array<ErrorLianluDto>
  message: string
  total: number
}
interface FileDataDto {
  file: Blob
}
export default defineComponent({
  components: { UploadOutlined },
  setup(props, context) {
    const fileList = ref([]);
    let uploadLoading: Ref<boolean> = ref(false);
    const handleChange = (info: UploadChangeParam) => {
      console.log('info', info);

      if (info.file.status !== 'uploading') {
        console.log(info.file, info.fileList);
        console.log(Buffer.from([info.file]), 'binary');
        const fileBinary = Buffer.from(info.fileList)
        const blob = new Blob([fileBinary.buffer], {
          type: "application/vnd.ms-excel",
        });
        console.log(blob);
        const form = new FormData()
        form.append('file', blob)
        console.log(form);

        // const reader = new FileReader();
        // reader.readAsArrayBuffer(info.file);
      }
      if (info.file.status === 'done') {
        message.success(`${info.file.name} file uploaded successfully`);
      } else if (info.file.status === 'error') {
        message.error(`${info.file.name} file upload failed.`);
      }
    };
    const beforeUpload = (file: FileDataDto) => {
      // console.log('beforeFile', file);
      // // console.log('buffer', Buffer.from(file));
      // const fileBinary = Buffer.from([file.file]);
      // console.log('beforeUpload', fileBinary);
      uploadLoading.value = true
      const form = new FormData()
      form.append('file', file.file)
      // console.log('beforeUpload', form);
      insetErrorLianluByFileApi(form).then(res => {
        // console.log(res);
        const result = res as unknown as ResultDto
        if (result.code === 200) {
          context.emit('queryErrorLianluList');
          message.success(result.message);
        } else {
          message.error(result.message)
        }
        uploadLoading.value = false
      })
    }
    return {
      fileList,
      uploadLoading,
      // fun
      handleChange,
      beforeUpload
    };
  },
});
</script>

<style scoped>
</style>

